/**
 *
 */
Ext.define('vacake.view.Shopping', {
    extend: 'Ext.Container',
    xtype: 'shoppingView',

    config: {
        layout: 'vbox',
        items: [
            {
                xtype: 'toolbar',
                docked: 'top',
                title: '购物车'
            },
            {
                xtype: 'panel',
                layout: 'vbox',
                height: '88%',
                hidden: true,
                id: 'shoppingPanel',
                align: 'center',
                items: [
                    {
                        xtype: 'panel',
                        layout: 'hbox',
                        items: [
                            {
                                xtype: 'fieldset',
                                layout: 'hbox',
                                width: '50%',
                                items: [
                                    {
                                        xtype: 'label',
                                        cls:'font2 color2 height30',
                                        html: '总计：',
                                        margin: '0 4% 0 4%'
                                    },
                                    {
                                        xtype: 'label',
                                        cls:'font2 color5 height30',
                                        html: '￥ 0',
                                        id: 'showViewCount'
                                    }
                                ]
                            },
                            {
                                xtype: 'fieldset',
                                layout: 'hbox',
                                width: '50%',
                                items: [
                                    {
                                        xtype: 'label',
                                        cls:'font2 color2 height30',
                                        html: '数量：',
                                        margin: '0 4% 0 4%'
                                    },
                                    {
                                        xtype: 'label',
                                        cls:'font2 color2 height30',
                                        html: '0',
                                        id: 'showViewNumber'
                                    }
                                ]
                            }

                        ]
                    },
                    {cls:'fenge'},
                    {
                        xtype: 'list',
                        id: 'shopping_data_view',
                        store: 'Shopping',
                        height: '78%',
                        margin: '0 0 3% 0',
                        itemTpl:
                        "<div style='height:80px; position: relative'>" +
                            "<div style='position: absolute; top:-6px; right: -11px;'>" +
                                "<img src='resources/images/buy_icon2.png' height='56px;'>" +
                                "<div class='buy_icon2 rotate font1 color4'>￥{countprice}</div>" +
                            "</div>"+
                            "<img  src='{picurl}' style='float: left;height: 80px;width: 80px' class='radius'/> " +
                            "<div class='homelist_name height30 color2 font2'>{pname}</div>"+
                            "<div class='homelist_name height30 font3'>" +
                                "<span class='color3'>单价：</span>" +
                                "<span class='color3' style='margin-left: 5px;'>{sname}</span>" +
                                "<span class='color5' style='margin-left: 10px;'>￥{price}</span>" +
                            "</div>"+
                            "<div class='homelist_name height20 color5 font3'>" +
                                "<span class='color3'>数量：</span>" +
                                "<span class='color3' style='margin-left: 5px;'>{pnumber}</span> " +
                            "</div>" +

                        "</div>"

                    },
                    {
                        xtype: 'button',
                        id: 'balance',
                        ui: 'confirm',
                        text: '结算'
                    }
                ]
            },
            {
                xtype: 'panel',
                id: 'shoppingNullPanel',
                hidden: true,
                html: '<div style="width: 100%; height: 100%; text-align: center; vertical-align: middle">' +
                    '<img width="94" height="94" src="resources/images/null.png" style="margin-top:100px;"   /> ' +
                    '<div class="height30 color2 font2">购物车暂无产品</div>' +
                    '</div>'
                //html: '购物车暂无产品'
            }
        ],
        listeners: { 
            painted: function () {
                var shoppingCart = Ext.getStore('Shopping');
                shoppingCart.load({
                    params: {
                        cuid: window.localStorage.getItem('app_Login_id'),
                        cadid: window.localStorage.getItem('app_district_id')
                    },
                    callback: function (data) {
                        if (data.length == 0) {
                            Ext.getCmp('shoppingPanel').setHidden(true);
                            Ext.getCmp('shoppingNullPanel').setHidden(false);
                        } else {
                            Ext.getCmp('shoppingPanel').setHidden(false);
                            Ext.getCmp('shoppingNullPanel').setHidden(true);
                            var carCountPrice = 0;
                            var carCountNumber = 0;
                            shoppingCart.getData().each(function (shopping) {
                                carCountPrice = carCountPrice + parseFloat(shopping.get('countprice'));
                                carCountNumber = carCountNumber + parseInt(shopping.get('pnumber'));
                            });
                            Ext.getCmp('showViewCount').setHtml('￥ ' + carCountPrice);
                            Ext.getCmp('showViewNumber').setHtml(carCountNumber);
                        }
                    }});
                Ext.Viewport.unmask();
            }
        }
    }

});

